// options, entities selection through a list of blocks

body.caerp .entities_choice {
	padding: var(--padding-xl) 0;

	ul {
		flex-wrap: wrap;
		list-style-type: none;
		margin-right: -var(--padding-m);
		padding: var(--padding-xl) 0;

		li a {
			display: block;
			height: 100%;
			text-decoration: none;

			&:hover,
			&:focus,
			&:active {
				box-shadow: 0 2px 4px var(--box-shadow-color);
				transform: translateY(-1px);
			}

			&::after {
				clear: right;
				content: "";
				display: block;
			}

			p {
				font-size: .875rem;
				padding: var(--padding-s) 0;
			}
		}

		li>span,
		li>label {
			display: block;
			line-height: 1;
			height: 100%;

			strong {
				display: inline-block;
				padding-bottom: var(--padding-s);
			}

			span {
				display: block;
			}
		}

		li .thumbnail {
			background: var(--mask-layer-background-color);
			float: right;
			height: 4.5rem;
			padding: .25rem;
			width: 4.5rem;

			img {
				height: auto;
				max-height: 4rem;
				max-width: 4rem;
				width: auto;
			}
		}
	}

	&:not(.large_list) {
		.search_form {
			min-width: 12.5rem;
			width: calc(33.3333% - 10px);
		}

		li {
			margin: 0 var(--padding-m) var(--padding-m) 0;
			min-width: 12.5rem;
			width: calc(33.3333% - 10px);
		}

		li a,
		li>span {
			background: var(--form-main-button-background-color);
			color: var(--static-color);
			padding: var(--padding-m);

			h2 {
				margin-bottom: var(--padding-s);
			}

			span {
				font-size: .875rem;
			}
		}
	}
}

body.caerp h2.title+.entities_choice {
	ul {
		padding: 0;
	}
}

@media (max-width: $desktopWidth ) {
	body.caerp .entities_choice {

		li,
		.search_form {
			width: calc(50% - 10px);
		}
	}
}

@media (max-width: $mobileWidth ) {

	body.caerp .entities_choice,
	body.caerp .entities_choice:not(.large_list) {
		ul {
			width: 100%;
		}

		li,
		.search_form {
			margin-right: 0;
			width: 100%;
		}
	}
}